@import '~@/px2vw.less';

.personInfo {
    display: flex;
    flex-direction: row;
    margin: 0 .px2vw(12) [ @vw];
    padding: .px2vw(10) [ @vw] .px2vw(16) [ @vw] .px2vw(10) [ @vw];
    background: #f8f8f8;
    border-radius: .px2vw(4) [ @vw];
    border: 1px solid #f2f3f4;

    .main {
        flex: 1;
        margin-left: .px2vw(12) [ @vw];
        font-size: .px2vw(14) [ @vw];
        color: #bcc1cd;

        .employee {
            font-size: .px2vw(16) [ @vw];
            color: #2a2f3c;
            display: flex;
            align-items: center;
            line-height: .px2vw(22) [ @vw];

            .BizIcon {
                margin-left: .px2vw(8) [ @vw];
                margin-top: .px2vw(4) [ @vw];
                font-size: .px2vw(20) [ @vw];
                color: #b0b5bf;
            }
        }

        .f14 {
            font-size: .px2vw(14) [ @vw];
        }
    }
}

.entryMobileContainer {
    background: #fff;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;

    .fs16 {
        font-size: .px2vw(16) [ @vw];
    }

    .mobileAddStyle {
        flex: 1;
        margin-left: .px2vw(8) [ @vw];
    }

    .pdV {
        padding: .px2vw(4) [ @vw] 0;
    }

    .mb16 {
        margin-bottom: .px2vw(16) [ @vw];
    }

    :global {
        .itemHead {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-right: .px2vw(8) [ @vw];

            .itemHeadTitle {
                flex: 1;
                font-size: .px2vw(14) [ @vw];
                color: #2a2f3c;
            }

            .itemHeadExtra {
                font-size: .px2vw(12) [ @vw];
                margin-left: .px2vw(8) [ @vw];
            }
        }

        .listItemControl {
            display: flex;
            justify-content: center;
            align-items: center;
            color: #ffa22d;
            font-size: .px2vw(16) [ @vw];

            img {
                width: .px2vw(20) [ @vw];
                height: .px2vw(20) [ @vw];
                margin-right: .px2vw(4) [ @vw];
            }
        }

        .customTextarea {
            textarea {
                color: #858b9b;
            }
        }

        .customRadioBlock {
            display: block;

            .am-flexbox-item {
                padding: 0;
                margin: 0;

                .am-checkbox-agree {
                    margin-left: 0;
                }
            }
        }

        .upload {
            .ant-upload-picture-card-wrapper {
                display: block;
            }

            .ant-upload.ant-upload-select-picture-card {
                width: auto;
                height: auto;
                margin: 0;
                border: 0;
                border-radius: 50%;
                overflow: hidden;
            }

            .ant-upload.ant-upload-select-picture-card > .ant-upload {
                padding: 0;
            }

            .ant-upload-list-picture-card .ant-upload-list-item {
                border: 0;
            }

            .ant-upload-list-picture-card .ant-upload-list-item-info {
                border-radius: 50%;
                overflow: hidden;
            }
        }

        .formContainer {
            padding: 0 .px2vw(16) [ @vw] .px2vw(12) [ @vw];

            .formItemValue {
                font-size: .px2vw(14) [ @vw];
                color: #bcc1cd;
                word-break: break-all;
            }
        }

        .formContainerFixed {
            height: calc(100% - 60px - 45px - 25px);
            overflow: auto;
            -webkit-overflow-scrolling: touch;
        }

        .formControls {
            padding: 8px .px2vw(16) [ @vw];
            display: flex;
            align-items: center;
            box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.08);
        }

        .contentStyle {
            font-size: .px2vw(14) [ @vw];
            color: #49536c;
            white-space: pre-wrap;
            padding-top: .px2vw(8) [ @vw];
        }
    }
}

.mr24 {
    margin-right: .px2vw(24) [ @vw];
}

.ml24 {
    margin-left: .px2vw(24) [ @vw];
}

.pageError {
    margin: .px2vw(10) [ @vw];
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.65);
    font-size: .px2vw(14) [ @vw];
    font-variant: tabular-nums;
    line-height: 1.5;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: relative;
    padding: .px2vw(8) [ @vw] .px2vw(15) [ @vw] .px2vw(8) [ @vw] .px2vw(37) [ @vw];
    word-wrap: break-word;
    border-radius: .px2vw(4) [ @vw];
    background-color: #fff1f0;
    border: 1px solid #ffa39e;
}

.modalMaterialsTips {
    :global {
        .am-modal-title {
            line-height: .px2vw(28) [ @vw];
            font-size: .px2vw(18) [ @vw];
            font-weight: bold;
        }

        .am-modal-body {
            text-align: left;
            font-size: .px2vw(14) [ @vw];
            font-weight: 400;
            color: #2a2f3c;
            line-height: .px2vw(24) [ @vw];
        }
    }
}

.customPicker {
    border-radius: .px2vw(12) [ @vw] .px2vw(12) [ @vw] 0 0;
    :global {
        .am-modal-content {
            border-radius: .px2vw(12) [ @vw] .px2vw(12) [ @vw] 0 0;
        }
        .am-picker-popup-header-left {
            color: #858b9b;
        }

        .am-picker-popup-title {
            color: #2a2f3c;
            font-weight: 500;
        }

        .am-picker-col-item {
            overflow: hidden;
        }
    }
}

.nationalAreaPicker {
    &:extend(.customPicker);

    :global {
        .am-picker-col:first-child {
            flex: 1.6 !important;
        }

        .am-picker-col-item,
        .am-picker-col-item-selected {
            font-size: .px2vw(14) [ @vw];
        }
    }
}
